import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import { resolve } from "path";
import vueJsx from '@vitejs/plugin-vue-jsx'

function myPlugin() {
  // 自定义plugin
  const virtualFileId = "@my-virtual-file";
  return {
    name: "my-plugin", // required, will show up in warnings and errors
    resolveId(id) {
      // console.log('resolveId')
      if (id === virtualFileId) {
        return virtualFileId;
      }
    },
    load(id) {
      // console.log('load')
      if (id === virtualFileId) {
        return `export const msg = "from virtual file"`;
      }
    },
    transform(id) {
      // console.log('transform')
      if (id === virtualFileId) {
        return `export const msg = "from virtual file"`;
      }
    },
    config(option) {
      // 在解决之前修改Vite配置。挂钩接收原始用户配置（CLI选项与配置文件合并）。它可以返回将深度合并到现有配置中的部分配置对象，或者直接更改配置（如果默认合并无法实现所需的结果）。
      console.log("config", option);
    },
    configResolved(option) {
      // 在解决Vite配置后调用。使用此挂钩读取并存储最终解析的配置。当插件需要根据运行命令执行其他操作时，它也很有用。
      console.log("configResolved", option);
    },
    configureServer(option) {
      // 钩子用于配置开发服务器。最常见的用例是将自定义中间件添加到内部连接应用程序：
      console.log("configureServer", option);
    },
    transformIndexHtml(option) {
      // 用于转换的专用挂钩index.html。该挂钩接收当前的HTML字符串和转换上下文。上下文ViteDevServer在开发期间公开实例，而在构建期间公开汇总输出捆绑。
      console.log("transformIndexHtml", option);
    },
    handleHotUpdate(option) {
      // 执行自定义HMR更新处理。
      console.log("handleHotUpdate", option);
    },
  };
}

export default defineConfig({
  plugins: [
    vue(), 
    vueJsx()
    // myPlugin()
  ],
  resolve: {
    alias: {
      // 别名
      "@src": resolve(__dirname, "./src"),
    },
  },
  define: {
    // 设置全局变量并在type.d.ts设置ts的全局定义(直接就能拿到)
    MYPROCESS: 213456789,
    // "process.test": "我设置的process",
  },
  root: process.cwd(), // 设置根目录默认process.cwd()
  base: "/", // 设置公共路径默认'/'访问直接http://localhost:3000/
  mode: "development", // development和production
  json: {
    namedExports: true, // 是否支持json导入
    stringify: false, // 如果设置为true，则导入的JSON将转换为export default JSON.parse("...")比Object文字具有明显更高的性能，尤其是当JSON文件较大时。
  },
  esbuild: {
    // jsxInject: `import React from 'react'`, // 用于自动为ESBuild转换的每个文件注入JSX帮助程序导入
  },
  clearScreen: false, // 默认true Vite在记录某些消息时是否清除终端屏幕
  server: {
    host: "localhost",
    port: 3001,
    strictPort: true, // true端口被占用直接退出false为尝试下一个
    https: false,
    open: false,
    proxy: {
      "/api": {
        target: "www.baidu.com",
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, ""),
      },
    },
  },
  build: {
    outDir: "dist", // 打包路径
    assetsDir: "assets", // 静态目录
    assetsInlineLimit: 4096, // 小于此阈值的导入或引用资产将作为base64 URL内联
    cssCodeSplit: true, // 启用/禁用CSS代码拆分,禁用则整个项目中的所有CSS都将提取到一个CSS文件中
    sourcemap: false,
    manifest: false, // true构建还将生成一个manifest.json文件
    minify: "terser", // 默认值为Terser，它比较慢，但在大多数情况下会产生较小的包。Esbuild缩小的速度明显更快，但将导致捆绑包稍大。
    emptyOutDir: true, // 如果ViteoutDir在项目根目录内，则它将清空on build。如果outDir不在根目录下，它将发出警告，以避免意外删除重要文件。
    rollupOptions: {
      // rollup配置,会和vite内部汇总合并
    },
    commonjsOptions: {
      // 传递给@ rollup / plugin-commonjs的选项。这也适用于依赖项预捆绑
    },
    // lib: { // 构建为库。entry是必需的，因为该库不能将HTML用作条目
    //   entry: './src/main.ts',
    //   name: 'test',
    //   formats: ['es', 'umd'],
    // },
    terserOptions: {
      // 其他缩小选项可传递给Terser
    },
    // cleanCssOptions: {
    //   // 传递给clean-css的构造方法选项
    // },
  },
  optimizeDeps: {
    // 优化
    exclude: [], // 从预捆绑中排除的依赖项。
    include: [], // 默认情况下，不在内部的链接软件包node_modules不会预先捆绑在一起。使用此选项可以强制链接的软件包被预先捆绑
  },
});
